<template>
  <div class="app-container">
    <div class="filter-container" style="color:#909399;font-size:14px;">{{posmerchantInfo.name}}</div>
    <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
      <el-tab-pane name="paychannel" v-if="btnPower.ChannelInfo">
        <span slot="label"><i class="el-icon-date"></i> 通道信息</span>
        <div class="filter-container">
          <el-button v-if="btnPower.AddChannel" class="filter-item" type="primary" icon="el-icon-document" @click="channelCartsType = true">添加通道</el-button>
          <el-button v-if="btnPower.ConfigChannel" class="filter-item" type="primary" @click="channelMode">通道配置</el-button>
          <el-button v-if="btnPower.ChannelAddOpen" class="filter-item" type="primary" icon="el-icon-document" @click="getAddOpen">一键进件</el-button>
        </div>
        <el-table
          :data="merchantpaychannelLists"
          v-loading="merchantpaychannelListLoading"
          element-loading-text="Loading"
          border
          fit
          highlight-current-row>
          <el-table-column
            prop="merchantNo"
            label="商户编号"
            align="center">
          </el-table-column>
          <el-table-column
            prop="channelName"
            label="通道名称"
            align="center">
          </el-table-column>
          <el-table-column
            prop="checkStatus"
            :formatter="paychannelCheckStatusType"
            label="审核状态"
            width='80'
            align="center">
          </el-table-column>
          <el-table-column
            prop="whetherDef"
            :formatter="paychannelWhetherDefType"
            label="是否默认"
            width='80'
            align="center">
          </el-table-column>
          <el-table-column
            prop="checkInfo"
            label="审核信息"
            align="center"
            width='80'>
          </el-table-column>
          <el-table-column
            prop="settleType"
            :formatter="paychannelSettleTypes"
            label="结算类型"
            width='80'
            align="center">
          </el-table-column>
          <el-table-column
            prop="scanRate"
            label="费率(%)"
            width='80'
            align="center">
          </el-table-column>
          <el-table-column
            prop="useStatus"
            label="状态"
            width='80'
            :formatter="paychannelStatus"
            align="center">
          </el-table-column>
          <el-table-column
            prop="enableTime"
            label="启用时间"
            :formatter="timeFormat"
            align="center">
          </el-table-column>
          <el-table-column
            prop="stopTime"
            label="停用时间"
            :formatter="timeFormat"
            align="center">
          </el-table-column>
          <el-table-column
            label="操作"
            width='210'
            align="center">
            <template slot-scope="scope">
              <el-button type="primary" size="small" v-if="scope.row.checkStatus!=20&&btnPower.CheckChannel" @click="selectType(scope.row)">查询进件</el-button>
              <el-button v-if="scope.row.whetherHigQulitMerch==20&&btnPower.RevChannel" type="primary" size="small" @click="revPaychannel(scope.row)">修改</el-button>
              <el-button v-if="btnPower.DeleteChannel" type="primary" size="small" @click="delPaychannel(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>

        <el-dialog
          title="添加"
          :visible.sync="channelCartsType"
          :close-on-click-modal=false
          :show-close=false
          :destroy-on-close=true
          width="360px"
          center>
          <el-select v-model="addPaychannelId" placeholder="请选择通道" style="width: 100%; margin-bottom:10px;">
            <el-option
              v-for="item in paychannelListAll"
              :key="item.id"
              :label="item.channelName"
              :value="item.id">
            </el-option>
          </el-select>
          <el-select v-model="addPaychannelType" placeholder="通道类型" style="width: 100%;">
            <el-option label="配置" value="10"></el-option>
            <el-option label="需要进件" value="20"></el-option>
          </el-select>
          <span slot="footer" class="dialog-footer">
            <el-button @click="channelCartsType = false;addPaychannelId=null">取 消</el-button>
            <el-button type="primary" @click="getAddPaychannel">确 定</el-button>
          </span>
        </el-dialog>

        <el-dialog
          title="查询"
          :visible.sync="selectTypes"
          :close-on-click-modal=false
          :destroy-on-close=true
          width="500px"
          center>
          <div class="dialogs">
            <div class="dialogs-title">状态:</div>
            <div class="dialogs-con">{{selectInfo.applymentState}}</div>
          </div>
          <div class="dialogs">
            <div class="dialogs-title">状态说明:</div>
            <div class="dialogs-con">{{selectInfo.msg}}</div>
          </div>
          <div class="dialogs" v-if="selectInfo.signUrl">
            <div class="dialogs-title">超管扫码:</div>
            <div class="dialogs-con">
              <el-image style="width: 200px;" :src="selectInfo.signUrl" fit="scale-down"></el-image>
            </div>
          </div>
          <div class="dialogs">
            <div class="dialogs-title">信息详情:</div>
            <div class="dialogs-con">{{selectInfo.describe}}</div>
          </div>
        </el-dialog>

        <el-dialog
          title="通道模式"
          :visible.sync="channelType"
          :close-on-click-modal=false
          :show-close=false
          :destroy-on-close=true
          width="750px"
          center>
          <div class="checkBox" v-for="(item,index) in channelList" :key="index">
            <div class="dialogs-title">{{item.channel.channelName}}:</div>
            <div class="dialogs-con">
              <el-checkbox v-for="(items,indexs) in item.payTypes" :key="indexs" v-model="items.check" :true-label="20" :false-label="10" @change="channelModel($event,index,indexs)">{{items.tip}}</el-checkbox>
            </div>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button @click="channelType = false;">取 消</el-button>
            <el-button type="primary" @click="getOk">确 定</el-button>
          </span>
        </el-dialog>
      </el-tab-pane>

      <!-- <el-tab-pane name="entry" label="入账信息">
        <el-table
          :data="entryLists"
          v-loading="entryListLoading"
          element-loading-text="Loading"
          border
          fit
          highlight-current-row>
          <el-table-column
            type="index"
            label="序号"
            width="50"
            align="center">
          </el-table-column>
          <el-table-column
            label="操作"
            align="center">
            <template slot-scope="scope">
              <el-button type="primary" size="small" @click="">编辑</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane> -->
    </el-tabs>
    <!-- <pagination v-show="total>0" :total="total" :page.sync="params.current" :limit.sync="params.size" @pagination="getTransList" /> -->
  </div>
</template>

<style>
.dialogs{ width: 100%; height: auto; overflow: hidden; margin-bottom: 20px;}
.dialogs-title{ width: 20%; float: left; cursor:pointer;}
.dialogs-con{ width: 80%; float: left;}

.checkBox{ width: 100%; height: auto; overflow: hidden; }
</style>

<script>
import Pagination from '@/components/Pagination'
import { merchantpaychannelList, paychannelList, delmerchantpaychannel, selectwxapply, ryxAddpartQuery, sxfAddpartQuery, sxfAddhltxapply, ryxAddpart, wxAddpart, payModeList, addPayMode, entryList ,multiMerchant, sxfAddpart,hltxaddpart} from '@/api/api.verify.js'

export default {
  components:{Pagination},
  name: 'StoreSet',
  data() {
    return {
      btnPower:JSON.parse(localStorage.getItem('btnList')),//按钮权限
      activeName:'paychannel',
      posmerchantInfo:{},//门店信息
      //通道
      merchantpaychannelListLoading: true,
      channelList:[],//通道配置列表
      merchantpaychannelLists:[],//商户通道列表
      paychannelListAll:[],//全部支付通道列表
      posmerchantInfo:{},//商户信息
      channelCartsType:false,//添加弹窗
      channelType:false,//通道模式配置弹窗
      addPaychannelId:null,//新增通道ID
      addPaychannelType:"10",//新增通道类型
      selectTypes:false,//查询弹窗
      selectInfo:{},//查询信息

      //入账
      entryListLoading:true,
      entryLists:[],//入账信息列表
    }
  },
  created() {
    this.getStart();
  },
  methods: {
    getStart(){//初始化
      this.posmerchantInfo=this.$route.query
      this.getMerchantpaychannelList()
      this.getPaychannelList()
    },
    //通道
    getMerchantpaychannelList(){//获取商户通道列表
      let _this=this
      let data={}
      this.merchantpaychannelListLoading=true
      data.merchantId=this.posmerchantInfo.id
      merchantpaychannelList(data).then(d=>{//获取商户通道列表
        _this.merchantpaychannelLists=d.data;
      }).finally(d=>{
        _this.merchantpaychannelListLoading=false
      })
    },
    getPaychannelList(){//获取全部通道列表
      let _this=this
      paychannelList({}).then(d=>{
        _this.paychannelListAll=d.data;
      });
    },
    getAddOpen(){
      let _this=this
      this.$confirm('是否一键进件','提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        center: true
      }).then(() => {
          let data={}
          data.merchantId=_this.posmerchantInfo.id
          multiMerchant(data).then(d=>{
            _this.$message({
                type: 'success',
                message: '进件成功!'
            });
            _this.getStart();
          })
      }).catch(() => {
          this.$message({
          type: 'info',
          message: '已取消进件'
          });
      });
    },
    getAddPaychannel(){//添加支付通道
        let _this=this;
        if(this.merchantpaychannelLists.find(t => t.channelId == _this.addPaychannelId)){
          _this.$message({
            type: 'error',
            message: '已有此支付通道'
          });
          return;
        };
        if(this.addPaychannelType==10){//表单
          switch(Number(this.addPaychannelId)){
            case 301://微信刷脸直连
              this.$router.push({name:'WxForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 321://葫芦
              this.$router.push({name:'HlcyForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 381://小精灵
              this.$router.push({name:'XjlForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 261://华夏银行
              this.$router.push({name:'HxbankForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 441://支付宝官通
              this.$router.push({name:'AliForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 421://酷点支付
              this.$router.push({name:'KdForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 481://小马哥支付
              this.$router.push({name:'XmgForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 461://葫芦天下（蔡志威）
              this.$router.push({name:'HlczwForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 521://葫芦天下（蔡志威-鹤山）
              this.$router.push({name:'HlczwhsForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 541://随行付-彩娱
              this.$router.push({name:'SxfcyForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 561://随行付-蔡志威
              this.$router.push({name:'SxfczwForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 581://聪明付
              this.$router.push({name:'CmfForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 601://葫芦天下（高洪兴）
              this.$router.push({name:'HlghxForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 621://扫呗支付
              this.$router.push({name:'SbzfForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 622://盒子支付
              this.$router.push({name:'HzzfForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 641://葫芦天下-官方合作
              this.$router.push({name:'Hlgfhz', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            case 661://广捷
              this.$router.push({name:'GjForm', query: this.posmerchantInfo })
              _this.cartsType=false
              break;
            default:
              _this.cartsType=false
              _this.$message({
                  type: 'error',
                  message: '无此通道配置'
              });
          }
        }else if(this.addPaychannelType==20){//接口
          switch(Number(this.addPaychannelId)){
            case 301://微信刷脸直连
              wxAddpart({"merchantId":this.posmerchantInfo.id,"channelId":301}).then(d=>{
                _this.cartsType=false
                _this.$message({
                    type: 'success',
                    message: '添加成功!'
                });
                _this.getStart();
              });
              break;
            case 321://葫芦天下支付
              hltxaddpart({"merchantId":this.posmerchantInfo.id,"channelId":321}).then(d=>{
                _this.cartsType=false
                _this.$message({
                    type: 'success',
                    message: '添加成功!'
                });
                _this.getStart();
              });
              break;
            case 342://瑞银信
              ryxAddpart({"merchantId":this.posmerchantInfo.id,"channelId":342}).then(d=>{
                _this.cartsType=false
                _this.$message({
                    type: 'success',
                    message: '添加成功!'
                });
                _this.getStart();
              });
              break;
            case 541://随行付-彩娱
              sxfAddpart({"merchantId":this.posmerchantInfo.id,"channelId":541}).then(d=>{
                _this.cartsType=false
                _this.$message({
                    type: 'success',
                    message: '添加成功!'
                });
                _this.getStart();
              });
              break;
            default:
              _this.cartsType=false
              _this.$message({
                  type: 'error',
                  message: '无此通道进件'
              });
          }
        }
    },
    revPaychannel(e){//修改支付通道
      let data=this.posmerchantInfo
      data.typeId=e.id
      console.log(e)
      switch(Number(e.channelId)){
        case 301://微信刷脸直连
          this.$router.push({name:'WxForm', query: data })
          break;
        case 321://葫芦天下支付
            this.$router.push({name:'HuluForm', query: data })
            break;
        case 381://小精灵
            this.$router.push({name:'XjlForm', query: data })
            break;
        case 261://华夏银行
            this.$router.push({name:'HxbankForm', query: data })
            break;
        case 441://支付宝官通
            this.$router.push({name:'AliForm', query: data })
            break;
        case 421://酷点支付
            this.$router.push({name:'KdForm', query: data })
            break;
        case 481://小马哥支付
            this.$router.push({name:'XmgForm', query: data })
            break;
        case 461://葫芦天下（蔡志威）
            this.$router.push({name:'HlczwForm', query: data })
            break;
        case 521://葫芦天下（蔡志威-鹤山）
            this.$router.push({name:'HlczwhsForm', query: data })
            break;
        case 541://随行付-彩娱
            this.$router.push({name:'SxfcyForm', query: data })
            break;
        case 561://随行付-蔡志威
            this.$router.push({name:'SxfczwForm', query:data })
            break;
        case 581://聪明付
            this.$router.push({name:'CmfForm', query:data })
            break;
        case 601://葫芦天下（高洪兴）
            this.$router.push({name:'HlghxForm', query: data })
            break;
        case 621://扫呗支付
            this.$router.push({name:'SbzfForm', query: data })
            break;
        case 622://盒子支付
            this.$router.push({name:'HzzfForm', query: data })
            break;
        case 641://葫芦天下-官方合作
            this.$router.push({name:'Hlgfhz', query: data })
            break;
        case 661://广捷
            this.$router.push({name:'GjForm', query: data })
            break;
        default:
          this.$message({
              type: 'error',
              message: '此通道无法修改'
          });
      }
    },
    delPaychannel(e){//删除支付通道
        let _this=this;
        this.$confirm('是否删除此通道?','提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          center: true
        }).then(() => {
            let data={}
            data.id=e.id;
            delmerchantpaychannel(data,"DELETE").then(d=>{
                if (d.code == 1) {
                    _this.$message({
                        type: 'success',
                        message: '删除成功!'
                    });
                    _this.getStart();
                };
            });
        }).catch(() => {
            this.$message({
                type: 'info',
                message: '已取消删除'
            });
        });
    },
    selectType(e){//查询进件状态
      let _this=this;
      let data={};
      data.id=e.id;
      switch(Number(e.channelId)){
        case 301://微信刷脸直连
          selectwxapply({'merChannelId':e.id}).then(d=>{
            _this.selectInfo=d.data;
            _this.selectTypes=true;
            _this.getStart();
          });
          break;
        case 321://葫芦天下支付
          selectwxapply({'merChannelId':e.id}).then(d=>{
            _this.selectInfo=d.data;
            _this.selectTypes=true;
            _this.getStart();
          });
          break;
        case 342://瑞银信
          ryxAddpartQuery(data).then(d=>{
            _this.getStart();
            _this.channelCartsType=false
          });
          break;
        case 541://随行付-彩娱
          sxfAddpartQuery(data).then(d=>{
            _this.getStart();
            _this.channelCartsType=false
          });
          break;
        default:
          this.$message({
            type: 'error',
            message: '此通道无法查询'
          });
      }

    },
    channelMode(){//通道模式弹窗
      let _this=this;
      let data={};
      data.merchantId=this.posmerchantInfo.id
      payModeList(data).then(d=>{
         _this.channelList=d.data;
         _this.channelType=true;
      });
    },
    getOk(){//配置通道模式点击确定
      let _this=this;
      let arrays=[];
      for(let i=0;i<this.channelList.length;i++){
          for(let ii=0;ii<this.channelList[i].payTypes.length;ii++){
              if(this.channelList[i].payTypes[ii].check==20){
                  let datas={};
                  datas.merchId=this.posmerchantInfo.id
                  datas.merchChanId=this.channelList[i].channel.id;
                  datas.payType=this.channelList[i].payTypes[ii].code;
                  arrays.push(datas);
              }
          }
      }
      addPayMode(arrays).then(d=>{
        _this.$message({
          message: '修改成功',
          type: 'success'
        });
        _this.channelType=false;
      });
    },
    channelModel(e,d1,d2){//通道模式逻辑
      for(let i=0;i<this.channelList.length;i++){
        if(i!=d1){
          this.channelList[i].payTypes[d2].check="10";
        }
      }
    },

    timeFormat(row, column, cellValue, index) {
      if(cellValue){
        return this.common.getLocalTime(parseInt(cellValue));
      }else{
        return "无"
      }
    },
    paychannelStatus(row, column, cellValue){//状态
      if(cellValue==10){
        return '使用中';
      }else if(cellValue==20){
        return '未使用';
      }else{
        return cellValue;
      }
    },
    paychannelCheckStatusType(row, column, cellValue){//审核状态
      if(cellValue==10){
        return '待审核';
      }else if(cellValue==20){
        return '审核通过';
      }else if(cellValue==30){
        return '审核未通过';
      }else{
        return cellValue;
      }
    },
    paychannelWhetherDefType(row, column, cellValue){//是否默认
      if(cellValue==10){
        return '是';
      }else if(cellValue==20){
        return '否';
      }else{
        return cellValue;
      }
    },
    paychannelSettleTypes(row, column, cellValue){//结算类型
      if(cellValue=='T'){
        return 'T+1结算';
      }else if(cellValue=='D'){
        return 'D+1结算';
      }else{
        return cellValue;
      }
    },
    //入账
    getEntryList(){//入账信息列表
      let _this=this
      let data={}
      data.merchantId=this.posmerchantInfo.id
      this.entryListLoading=true
      entryList(data).then(d=>{
        _this.entryLists=d.data
      }).finally(d=>{
        _this.entryListLoading=false
      })
    },


    handleClick(tab){//点击tabs触发
      switch(tab.name){
        case "paychannel"://通道信息
          this.getMerchantpaychannelList()
          break
        case "entry"://称重规则
          this.getEntryList()
          break
      }
    },
  }
}
</script>

